<body>
    <table id="role_list_sel" style="width:80%;height:80%">
    </table>
    <div id="rolelist_tb_sel">
        <div style="margin: 10px">
            角色名: <input class="easyui-textbox" data-options="prompt:'角色名'" style="width: 200px" id="roleName_sel"/>
            角色类型: <select data-options="prompt:'角色类型检索'" style="width: 200px" class="easyui-combobox" id="roleType_sel">
                <option value="-1">所有</option>
                <option value="0">正常</option>
                <option value="1">系统</option>
            </select>
            <a href="#" id="searchRoleList_sel" class="easyui-linkbutton" data-options="iconCls:'icon-search',plain:true">查询</a>
        </div>
    </div>

    <script>
        $('#role_list_sel').datagrid({
            title: '数据库列表',
            url:'/admin/role/list',
            columns:[[
                {field:'id',title:'ID', checkbox: true},
                {field:'roleName',title:'角色名称'},
                {field:'roleType',title:'类型'},
                {field:'createUserName',title:'创建人'},
                {field:'createTime',title:'创建时间'},
                {field:'updateUserName',title:'更新人'},
                {field:'updateTime',title:'更新时间', formatter: function (value,row,index) {
                    if (row.checked) {
                        $('#role_list_sel').datagrid("selectRow", index);
                        $('#role_list_sel').datagrid("checkRow", index);
                    }
                    return value;
                }}
            ]],
            fit: true,
            idField: 'id',
            pagination:true,
            rownumbers:true,
            checkOnSelect: true,
            selectOnCheck: true,
            singleSelect: false,
            toolbar: '#rolelist_tb_sel'
        });

        var p_role_sel = $('#role_list_sel').datagrid('getPager');
        $(p_role_sel).pagination({
            pageSize: 10,//每页显示的记录条数，默认为10
            pageList: [10,20,50,100],//可以设置每页记录条数的列表
            beforePageText: '第',//页数文本框前显示的汉字
            afterPageText: '页    共 {pages} 页',
            displayMsg: '当前显示 {from} - {to} 条记录   共 {total} 条记录',
        });

        $("#searchRoleList_sel").click(function(){
            var record = $("#user_list").datagrid("getSelected");
            if (!record) {
                $.messager.alert('Error', '请选择用户!', 'error');
                return;
            }
            var param = {
                roleName: $("#roleName_sel").val(),
                userId: record.id
            };
            var type = $("#roleType_sel").val();
            if (type && type != -1) {
                param.roleType = type;
            }
            $('#role_list_sel').datagrid("load", param);
        });

    </script>
</body>